﻿<!DOCTYPE html>
<html>
<head>
<title>产品</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />	
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Vegetables Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='http://fonts.useso.com/css?family=Exo:100,200,300,400,500,600,700,800,900' rel='stylesheet' type='text/css'>
<!--//fonts-->
<script src="js/jquery.easydropdown.js"></script>
<link rel="shortcut icon" href="favicon.png" >
</head>
<body> 
	  <!--header-->
	<div class="header">
		<div class="container">
			<div class="header-top">			
				<div class="logo">
					<a href="index.html"><img src="images/logo.png" alt=" " ></a>
				</div>
				<div class="search-in">
					<div class="header-grid">
							<ul>
								<li class="in-up"><a href="contact.html" class="scroll">联系我们</a> <label>|</label></li>
								<li class="in-up"><a href="signin.html" class="scroll"> 登录 </a> <label>|</label></li>
								<li><a href="signup.html" class="scroll">注册</a> <label>|</label></li>
								<li><a href="404.html" class="scroll">设为首页</a> </li>
							</ul>
				</div>
				<div class="search-top">
					<div class="search">
						<form>
							<input type="text" value="搜索商品" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = '';}" >
							<input type="submit"  value="">
						</form>
				</div>
				<div class="cart">
					<a href="cart.html" class="cart-in"> </a>
					<span> 5</span>
				</div>
				<div class="clearfix"> </div>
				</div>
			</div>	
			<div class="clearfix"> </div>
			</div>
			<div class="header-bottom-bottom">
				<div class="top-nav">
					<span class="menu"> </span>
					<ul>
						<li ><a href="about.html">关于我们</a></li>
						<li class="active"><a href="product.html" > 产品</a></li>
						<li><a href="services.html" > 服务 </a></li>
						<li><a href="market.html" >每日市场</a></li>
						<li><a href="blog.html" > 博客 </a></li>
						<li><a href="contact.html" > 联系我们 </a></li>
					</ul>	
				<script>
					$("span.menu").click(function(){
						$(".top-nav ul").slideToggle(500, function(){
						});
					});
				</script>			
				</div>	
				<div class="clearfix"> </div>
				</div>
		</div>
	</div>
	<!---->
	<!---->
	<div class="banner-in">
		<div class="container">
			<h6>HOME / <span>PRODUCTS</span></h6>
		</div>
	</div>
<!---->
			<div class="container">
				<div class="product">
					
				<ul id="filters">
						<li class="active"><span class="filter" data-filter="app card icon logo  web">所有</span></li>
						<li><span class="filter" data-filter="card">蔬菜 </span></li>
						<li><span class="filter" data-filter="icon">瓜果</span></li>
						<li><span class="filter" data-filter="logo">禽畜</span></li>
						<li><span class="filter" data-filter="app">水产</span></li>
					</ul>
					<div id="portfoliolist">
					<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper ">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon">
						  <img class="img-responsive " src="images/p1.jpg" alt="" />
						   
						     <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>							
						</div>
					</div>				
					<div class="portfolio icon mix_all" data-cat="icon" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						    <img class="img-responsive" src="images/p2.jpg" alt=""  />
						    <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		                </div>
					</div>		
					<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p3.jpg"  alt="" />
						      <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		                </div>
					</div>				
					<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper ">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p4.jpg" alt=""  />
						     <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		                </div>
					</div>	
					<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper ">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p5.jpg" alt=""  />
						     <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		                </div>
					</div>			
					<div class="portfolio icon mix_all" data-cat="icon" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p6.jpg" alt=""  />
						    <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		               </div>
					</div>
					<div class="portfolio logo mix_all " data-cat="logo" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper ">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p7.jpg" alt="p7"  />
						     <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		               </div>
					</div>
					<div class="portfolio logo mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p8.jpg" alt=""  />
						     <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		               </div>
					</div>
					<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper port">		
							<a href="single.html" class="b-link-stripe b-animate-go  thickbox play-icon ">
						     <img class="img-responsive" src="images/p9.jpg" alt=""  />
						     
						     <ul class="social-ic">
								<li class="down"><span> </span></li>
								<li class="in-search"><span> </span></li>
							</ul>
							</a>
		               </div>
					</div>
					
					<div class="clearfix"> </div>
					</div>	
			<!-- Script for gallery Here -->
				<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>
					<script type="text/javascript">
					$(function () {
						
						var filterList = {
						
							init: function () {
							
								// MixItUp plugin
								// http://mixitup.io
								$('#portfoliolist').mixitup({
									targetSelector: '.portfolio',
									filterSelector: '.filter',
									effects: ['fade'],
									easing: 'snap',
									// call the hover effect
									onMixEnd: filterList.hoverEffect()
								});				
							
							},
							
							hoverEffect: function () {
							
								// Simple parallax effect
								$('#portfoliolist .portfolio').hover(
									function () {
										$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
										$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');				
									},
									function () {
										$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
										$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');								
									}		
								);				
							
							}
				
						};
						
						// Run the show!
						filterList.init();
						
						
					});	
					</script>
			<!-- Gallery Script Ends -->

				</div>
			</div>
			<!---->
			<div class="map-top">
				<div class="map">	
					<iframe src="baidumap.html"></iframe>
				</div>
				<div class="address">
					<h5>地址</h5>
					<p>陕鼓大道48号西安科技大学</p>
					<a href="网址" class="company">http://www.lvsukang.xin</a>
					<button class="mapHide">点击隐藏</button>
				</div>
			</div>
			<!--footer-->
			<div class="footer">
				<div class="container">
					<p class="footer-grid">@2017 绿速康农科服务有限公司 版权所有</a></p>
			 	</div> 	
			</div>
			<script src="js/main.js"></script>


</body>
</html>